<template>
  <div>
    <!-- 连接菜单 -->
    <connection-menu
      v-if="data && data.type === 'connection'"
      :visible="visible"
      :x="x"
      :y="y"
      :data="data"
      @update:visible="$emit('update:visible', $event)"
      @command="handleCommand"
    />
    
    <!-- 数据库菜单 -->
    <database-menu
      v-else-if="data && data.type === 'database'"
      :visible="visible"
      :x="x"
      :y="y"
      :data="data"
      @update:visible="$emit('update:visible', $event)"
      @command="handleCommand"
    />
    
    <!-- 表菜单 -->
    <table-menu
      v-else-if="data && data.type === 'table'"
      :visible="visible"
      :x="x"
      :y="y"
      :data="data"
      @update:visible="$emit('update:visible', $event)"
      @command="handleCommand"
    />
    
    <!-- 视图菜单 -->
    <view-menu
      v-else-if="data && data.type === 'view'"
      :visible="visible"
      :x="x"
      :y="y"
      :data="data"
      @update:visible="$emit('update:visible', $event)"
      @command="handleCommand"
    />
    
    <!-- 分类菜单 -->
    <category-menu
      v-else-if="data && data.type === 'category'"
      :visible="visible"
      :x="x"
      :y="y"
      :data="data"
      @update:visible="$emit('update:visible', $event)"
      @command="handleCommand"
    />
    
    <!-- 查询菜单 -->
    <base-context-menu
      v-else-if="data && data.type === 'query'"
      :visible="visible"
      :x="x"
      :y="y"
      :data="data"
      @update:visible="$emit('update:visible', $event)"
      @close="$emit('update:visible', false)"
    >
      <menu-item
        icon="Document"
        label="打开查询"
        command="openQuery"
        shortcut="Enter"
        @click="({ command }) => handleCommand({ command, data })"
      />
    </base-context-menu>
  </div>
</template>

<script setup>
import { defineProps, defineEmits } from 'vue'
import BaseContextMenu from './BaseContextMenu.vue'
import MenuItem from './MenuItem.vue'
import ConnectionMenu from './database/ConnectionMenu.vue'
import DatabaseMenu from './database/DatabaseMenu.vue'
import TableMenu from './database/TableMenu.vue'
import ViewMenu from './database/ViewMenu.vue'
import CategoryMenu from './database/CategoryMenu.vue'

const props = defineProps({
  visible: {
    type: Boolean,
    default: false
  },
  x: {
    type: Number,
    default: 0
  },
  y: {
    type: Number,
    default: 0
  },
  data: {
    type: Object,
    default: () => null
  }
})

const emit = defineEmits(['update:visible', 'command'])

// 处理菜单命令
const handleCommand = ({ command, data }) => {
  emit('command', { command, data })
}
</script> 